Common buttons 常用按鈕

五種按鈕型別：懸浮（Elevated）、填充（Filled）、色調填充（Filled Tonal）、描邊（Outlined）、文字（Text）

Elevated Button 懸浮按鈕

• 中等優先順序操作，比填充按鈕（Filled Button）視覺強排程略低。

• 適用於強調次要操作，比如“儲存草稿”或“稍後提醒”。

• 提供更溫和的視覺吸引力，與其他按鈕搭配使用時，不會喧賓奪主。

Filled button填充按鈕

• 高優先順序操作，用於主要按鈕或最終確認按鈕（如“提交”、“儲存”）。

• 適用於強烈引導使用者互動的操作，視覺對比度高。

• 在一組按鈕中，填充按鈕通常是最突出的，應用於主要操作，其他次要操作可使用較低強排程的按鈕（如色調按鈕或文字按鈕）。

Filled Tonal Button 填充色調按鈕

• 適用於次要操作，提供視覺吸引力的同時不過分強調。

• 在同一介面上，填充色調按鈕可作為填充按鈕（Filled Button）的補充，用於不太關鍵但仍然重要的操作。

• 適用於背景顏色較淺的介面，增強對比度，使文字清晰可見。

Outlined Button 輪廓按鈕

• 適用於次要操作，比填充按鈕（Filled Button）和色調填充按鈕（Tonal Button）視覺上更輕，但仍提供足夠的可互動性。

• 適用於背景色較淺的介面，保持視覺清晰度。

• 可用於強調但不搶佔焦點的操作，例如“取消”、“返回”或“檢視詳情”按鈕。

Text Button 文字按鈕

• 適用於次要或補充操作，例如“取消”、“跳過”或“瞭解更多”按鈕。

• 適用於背景色較淺的介面，保持視覺清晰度。

• 可用於強調但不搶佔焦點的操作，相比輪廓按鈕（Outlined Button）視覺更輕。